<template>
	<view class="services">
		<!-- <view class="top">
			<uv-navbar title="服务介绍" height="44px" titleStyle="{font-weight: bold;font-size: 1.1rem;}"
				@leftClick="leftClick"></uv-navbar>
		</view> -->
		<!-- 服务 -->
		<view class="photo">
			<view class="one">
				<!-- <uv-swiper height="400px" :list="ListMasters.image"></uv-swiper> -->
				<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" style="height: 400px;">
					<swiper-item>
						<view class="swiper-item">
							<image :src="ListMasters.image" mode=""></image>
						</view>
					</swiper-item>
					<swiper-item>
						<view class="swiper-item"></view>
					</swiper-item>
				</swiper>
				<view class="icon">
					<uv-icon @click="goback" name="arrow-left" size="24px"></uv-icon>
				</view>
			</view>
			<view class="two">
				<view class="two-left">已实名</view>
				<view class="two-right">
					<image src="../../static/image/位置.png" mode=""></image> 544m
				</view>
			</view>
			<view class="three">
				<view class="two-left">师傅名称</view>
				<view class="two-right"> 已服务:{{ListMasters.num}}|从业经历:{{ListMasters.age}} </view>
			</view>
			<view class="four">
				<view>{{ListMasters.textarea}}</view>
			</view>
		</view>
		<!-- 服务介绍 -->
		<view class="introduced">
			<view class="all" v-for="item in ListMasters1 " :key="item.id">
				<view class="head">
					<view class="head-left">{{item.serve_name }}</view>
					<view class="head-right">{{item.price}}</view>
				</view>
				<view class="center">
					<uv-button type="primary" color="#008c8c" shape="circle" text="立即预约"></uv-button>
				</view>


			</view>
		</view>
		<!-- 师傅评价 -->
		<view class="evaluation">
			<view class="top">
				<view class="top-left">师傅评价</view>
				<view class="top-right">查看全部<uv-icon @click="goevaluation" name="arrow-right" size="20px"></uv-icon></view>
			</view>
			<view class="bottom" v-for="item in ListMasters2 ">
				<view class="bottom-left">
					<uv-avatar :src="item.image"></uv-avatar>
				</view>
				<view class="bottom-right">
					<view class="one">{{item.mmbers_name}}</view>
					<view class="two">
						<uv-rate size="16px" :count="count" v-model="value1"></uv-rate>
						<view style="margin-left: 20rpx; color: #c1c1c1;">{{item.create_time}}</view>
					</view>
					<view class="three">{{item.text}}</view>
					<view class="four">
						<image :src="item.images" mode=""></image>
					</view>
				</view>
			</view>
		</view>
		<view class="box"></view>
		<!-- 下单 -->
		<view class="place">
			<uv-button type="primary" color="#008c8c" shape="circle" text="收藏师傅" @click="goEvaluation"></uv-button>

		</view>
	</view>
</template>

<script>
	import {
		myRequest
	} from '@/request/request.js'
	export default {
		data() {
			return {
				// 师傅列表
				ListMasters: '',
				ListMasters1: '',
				ListMasters2: '',
				count: 5,
				value1: 4,
				list: [
					'/static/image/宠物医生.png',
					'/static/image/宠物医生.png',
					'/static/image/宠物医生.png',
				],
				tips: '',
				value: '内容'

			}
		},
		onLoad(e) {
			console.log(e.id);
			// 师傅简介
			const that = this
			myRequest('master/index?server=1', function(err, data) {
				if (err) {
					uni.showToast({
						title: err,
					});
				} else {
					// 1
					that.ListMasters = data.data.list[0]
					// 2
					that.ListMasters1 = data.data.list[1]
					// 3
					that.ListMasters2 = data.data.list[2].data
					// console.log("成功", that.ListMasters2);
				}
			}, 'POST', {
				id: 1,
			})
		},
		methods: {
			// 跳转立即评价
			goEvaluation(){
				const name = this.$route.query.id
				console.log(name);
				uni.navigateTo({
					url: `/pages/lijipingj/lijipingj?name=${JSON.stringify(name)}`
				})
			},
			// 跳全部评价
			goevaluation() {
				const name = this.$route.query.id
				uni.navigateTo({
					url: `/pages/evaluation/evaluation?name=${JSON.stringify(name)}`
				})
			},

			goback() {
				uni.navigateBack({
					delta: 1
				});
			}


		}
	}
</script>

<style lang="scss">
	@import url('masterdetails.scss');
</style>